<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2025/5/6
  Time: 16:03
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>


<html>
<head>
    <meta charset="UTF-8">
    <link rel="icon" href="../picture/image-removebg-preview.png" type="image/x-icon" sizes="64x64">
    <title>学生信息管理系统</title>
    <link rel="stylesheet" type="text/css" href="../ui/themes/default/easyui.css">
    <link rel="stylesheet" type="text/css" href="../ui/themes/icon.css">
    <link rel="stylesheet" type="text/css" href="../ui/demo/demo.css">
    <style>
        body {
            margin: 0;
            padding: 0;
            font-family: "Microsoft YaHei", sans-serif;
        }
        .header {
            background-color: white;
            height: 110px;
            line-height: 105px;
            border-bottom: 1px solid #e0e0e0;
            padding: 0 20px;
        }
        .system-title {
            z-index: 999;
            color: #000000;
            font-size: 39px;
            font-weight: bold;

        }
        .user-info {
            position: relative;
            z-index: 999;
            float: right;
            margin-top: 5px;
        }
        .welcome-text {
            font-weight: bold;
            z-index: 999;
            margin-right: 15px;
            color: rgb(117, 102, 87);
            font-size: 21px;
        }
        .logout-btn {
            font-weight: bold;
            color: rgb(117, 102, 87);
            text-decoration: none;
            z-index: 999;
            font-size: 21px;
        }
        .logout-btn:hover {
            color: red;
        }
        .main-container {
            position: absolute;
            top: 60px;
            bottom: 0;
            left: 0;
            right: 0;
        }
        .nav-menu {
            background-color: #f8fafc !important;
            border: none !important;
        }
        .nav-menu .panel-title {
            color: #333;
            font-weight: bold;
            font-size: 14px;
            padding: 20px 20px;
            border-bottom: 1px solid #e0e0e0;
            transition: all 0.3s;
        }
        .nav-menu .panel-header {
            border-radius: 0 !important;
            border: none !important;
        }
        .nav-menu .panel-body {
            border: none !important;
            padding: 5px 0 !important;
        }
        .nav-menu ul {
            list-style-type: none;
            padding-left: 0;
            margin: 0;
        }
        .nav-menu li {
            padding: 0;
        }
        .nav-menu a {
            color: #555;
            text-decoration: none;
            display: block;
            padding: 10px 20px 10px 35px;
            transition: all 0.3s;
            position: relative;
            font-size: 13px;
        }
        .nav-menu a:hover {
            background-color: #e6f2ff;
            color: #1890ff;
        }
        .nav-menu a:before {
            content: "→";
            position: absolute;
            left: 15px;
            color: #1890ff;
            font-size: 12px;
            transition: all 0.3s;
        }
        .nav-menu a:hover:before {
            transform: translateX(3px);
        }
        .nav-menu .accordion-header-selected {
            background: linear-gradient(to right, #e6f2ff, #d9ecff) !important;
        }
        .content-area {
            padding: 20px;
            background-color: white;
        }
        .welcome-panel {
            text-align: center;
            margin-top: 50px;
        }
        .welcome-title {
            font-size: 30px;
            color: rgb(145, 180, 214);
            margin-bottom: 30px;
        }
        .system-info {
            text-align: center;
            width: 600px;
            margin: 0 auto;
            line-height: 2;
        }
        .system-info p {
            margin: 10px 0;
        }

        .panel-title {
            height: 5px !important;
            line-height: 5px !important;
        }


        #logo {
            width: 80px;
            height: auto;
            max-width: 110%;
            transition: transform 0.3s ease;
        }

        #logo, .system-title {
            vertical-align: middle;
        }
    </style>
    <script type="text/javascript" src="../ui/jquery.min.js"></script>
    <script type="text/javascript" src="../ui/jquery.easyui.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/js/bootstrap.bundle.min.js" integrity="sha384-gtEjrD/SeCtmISkJkNUaaKMoLD0//ElJ19smozuHV6z3Iehds+3Ulb9Bn9Plx0x4" crossorigin="anonymous"></script>

</head>
<body>
<!-- 顶部标题栏 -->

<div class="header">
    <img src="<%=request.getContextPath()%>/Dormitory_management/images/login/21.png" class="peijing" style="position: absolute;z-index: 888; opacity: 0.5;width:100%;height: 111px;margin-left: -22px">
    <img src="../picture/image-removebg-preview.png" alt=""id="logo">
    <span class="system-title" style="z-index: 999;">学生宿舍管理系统</span>
    <div class="user-info"style="z-index: 999;">
        <a href="<%=request.getContextPath()%>/Change/user_edit.jsp" class="welcome-text" >${user.username}，您好</a>
        <a href="<%=request.getContextPath()%>/denglu/login.jsp" class="logout-btn" >安全退出</a>
    </div>
</div>

<!-- 主内容区 -->
<div class="main-container">
    <div class="easyui-layout" style="width:100%;height:100%;top:52px;">
        <!-- 左侧导航菜单 -->
        <div region="west" split="true" style="width:200px;">
            <div class="easyui-accordion nav-menu" style="width:100%;height:100%;">
                <c:if test="${user.role eq 'admin'}">
                    <div title="账户管理" style="overflow:auto;padding:10px;">
                        <ul>
                            <li><a href="javascript:void(0)"
                                   onclick="loadContent('<%=request.getContextPath()%>/Change/user_permission.jsp')">权限分配</a>
                            </li>
                            <li><a href="javascript:void(0)"
                                   onclick="loadContent('<%=request.getContextPath()%>/user_list.jsp')">用户管理</a></li>
                            <li><a href="javascript:void(0)"
                                   onclick="loadContent('<%=request.getContextPath()%>/admin/admin_list.jsp')">宿管管理</a>
                            </li>
                        </ul>
                    </div>
                </c:if>
                <div title="宿舍管理" style="overflow:auto;padding:10px;">
                    <ul>
                        <c:if test="${user.role eq 'admin' || user.role eq 'dormitory'}">
                            <li><a href="javascript:void(0)"
                                   onclick="loadContent('<%=request.getContextPath()%>/Dormitory_management/dorm_building.jsp')">楼栋信息管理</a>
                            </li>
                        </c:if>
                        <c:if test="${user.role eq 'admin' || user.role eq 'dormitory'}">
                            <li><a href="javascript:void(0)"
                                   onclick="loadContent('<%=request.getContextPath()%>/Dormitory_management/dorm_room.jsp')">房间分配</a>
                            </li>
                        </c:if>
                        <li><a href="javascript:void(0)"
                               onclick="loadContent('<%=request.getContextPath()%>/Dormitory_management/dorm_bed.jsp')">床位管理</a>
                        </li>
                        <c:if test="${user.role eq 'admin' || user.role eq 'dormitory'}">
                            <li><a href="javascript:void(0)"
                                   onclick="loadContent('<%=request.getContextPath()%>/Dormitory_management/dorm_score.jsp')">宿舍评分管理</a>
                            </li>
                        </c:if>
                    </ul>
                </div>
                <div title="学生管理" style="overflow:auto;padding:10px;">
                    <ul>
                        <c:if test="${user.role eq 'admin' || user.role eq 'dormitory'}">
                            <li><a href="javascript:void(0)"
                                   onclick="loadContent('<%=request.getContextPath()%>/Student_Management/student.jsp')">学生档案管理</a>
                            </li>
                        </c:if>
                        <c:if test="${user.role eq 'admin' || user.role eq 'dormitory'}">
                            <li><a href="javascript:void(0)"
                                   onclick="loadContent('<%=request.getContextPath()%>/Student_Management/student_checkin.jsp')">入住登记</a>
                            </li>
                        </c:if>
                        <c:if test="${user.role eq 'admin' || user.role eq 'student'}">
                            <li><a href="javascript:void(0)"
                                   onclick="loadContent('<%=request.getContextPath()%>/Student_Management/student_checkout.jsp')">退宿管理</a>
                            </li>
                        </c:if>
                        <c:if test="${user.role eq 'admin' || user.role eq 'dormitory'}">
                            <li><a href="javascript:void(0)"
                                   onclick="loadContent('<%=request.getContextPath()%>/student_violation.jsp')">违纪记录</a>
                            </li>
                        </c:if>
                    </ul>
                </div>
                <div title="打卡管理" style="overflow:auto;padding:10px;">
                    <ul>
                        <c:if test="${user.role eq 'admin' || user.role eq 'student'}">
                            <li><a href="javascript:void(0)"
                                   onclick="loadContent('<%=request.getContextPath()%>/clock/clock_in.jsp')">学生每日打卡</a>
                            </li>
                        </c:if>
                        <c:if test="${user.role eq 'admin' || user.role eq 'dormitory'}">
                            <li><a href="javascript:void(0)"
                                   onclick="loadContent('<%=request.getContextPath()%>/clock/clock_report.jsp')">打卡统计报表</a>
                            </li>
                        </c:if>
                        <c:if test="${user.role eq 'admin'}">
                            <li><a href="javascript:void(0)"
                                   onclick="loadContent('<%=request.getContextPath()%>/clock/clock_rule.jsp')">打卡规则配置</a>
                            </li>
                        </c:if>
                    </ul>
                </div>
                <div title="报修管理" style="overflow:auto;padding:10px;">
                    <ul>
                        <c:if test="${user.role eq 'admin' || user.role eq 'dormitory'}">
                            <li><a href="javascript:void(0)"
                                   onclick="loadContent('<%=request.getContextPath()%>/repair/repair_list.jsp')">维修记录管理</a>
                            </li>
                        </c:if>
                        <c:if test="${user.role eq 'admin' || user.role eq 'dormitory'}">
                            <li><a href="javascript:void(0)"
                                   onclick="loadContent('<%=request.getContextPath()%>/repair/repair_evaluationList.jsp')">报修评价</a>
                            </li>
                        </c:if>
                    </ul>
                </div>
            </div>
        </div>

        <!-- 右侧内容区域 -->
        <div id="content" region="center" class="content-area">
            <div class="welcome-panel">
                <h1 class="welcome-title">欢迎使用学生宿舍管理系统</h1>
                <div class="system-info">
                    <p><strong>系统环境</strong></p>
                    <p>系统环境：Windows</p>
                    <p>开发工具：IDEA</p>
                    <p>Java版本：JDK 1.8</p>
                    <p>服务器：tomcat 9.0</p>
                    <p>数据库：MySQL 8.0.27</p>
                </div>
            </div>
        </div>
    </div>
</div>

<script>
    // 加载内容页面的函数
    function loadContent(pageUrl) {
        // 确保URL是绝对路径
        if(!pageUrl.startsWith('<%=request.getContextPath()%>') && !pageUrl.startsWith('/')) {
            pageUrl = '<%=request.getContextPath()%>/' + pageUrl;
        }
// 先清空内容并移除所有脚本
        $('#content').empty();

// 使用iframe加载避免变量冲突
        $('#content').html('<iframe id="contentFrame" src="' + pageUrl + '" style="width:100%;height:100%;border:none;"></iframe>');

// 调整EasyUI布局
        $('.easyui-layout').layout('panel', 'center').panel('resize');
    }

    // 初始化打卡页面
    function initClockPage() {
        // 初始化时间显示
        if(typeof displayTime === 'function') {
            displayTime();
            setInterval(displayTime, 1000);
        }

        // 绑定表单提交事件
        $(document).off('submit', '#clock-in-form').on('submit', '#clock-in-form', function(e){
            e.preventDefault();

            var form = $(this);
            $.ajax({
                type: "POST",
                url: form.attr('action') || window.location.href,
                data: form.serialize(),
                success: function(response){
                    // 重新加载打卡页面
                    loadContent('<%=request.getContextPath()%>/clock/clock_in.jsp');
                },
                error: function(){
                    alert("打卡失败，请重试");
                }
            });
        });
    }
</script>
</body>
</html>
